<!DOCTYPE html>
<html data-content-max>
    <head>
        <title>VW-REM布局</title>
        <meta charset="utf-8">
        <meta lang="zh-CN">
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
        <link rel="stylesheet" href="./css/vw-rem.css">
    </head>

    <body data-content-max>
        <section class="container">
            <!-- 此处为固定宽高比的例子 -->
            <header class="header">
                <div class="header-content">375 * 150</div>
            </header>
            <nav>
                <ul>
                    <li>
                        <span class="icon">60 * 60</span>
                        <span>导航入口</span>
                    </li>
                    <li>
                        <span class="icon">60 * 60</span>
                        <span>导航入口</span>
                    </li>
                    <li>
                        <span class="icon f-border-radius">圆角</span>
                        <span class="f-border">导航入口</span>
                    </li>
                </ul>
            </nav>
            <main>
                <h3>填写信息</h3>
                <div class="info-items">
                    <p class="info-item">
                        <span>姓名</span>
                        <input type="text" class="info-item__name" placeholder="请填写姓名">
                    </p>
                    <p class="info-item info-item__tel">
                        <span>手机</span>
                        <input type="number" class="info-item__tel" placeholder="请填写手机号">
                    </p>
                </div>
                <h3>个人介绍</h3>
                <div class="info-items">
                    <p class="info-item f-p-0">
                        <textarea class="info-item__intro" placeholder="请填写一段简要的自我介绍"></textarea>
                    </p>
                </div>
                <div class="info-confirm">
                    <a href="javascript:;" class="info-confirm__btn">确认</a>
                </div>
            </main>
            <footer>375 * 75</footer>
        </section>
    </body>
</html>
